<template>
	<view class="page flex-col">
		<!-- 标题 -->
		<shopro-navbar back-icon-color="#020202" :background="{background:'#fff'}" @backHandler="goBack"
			:backTextStyle="{ color: '#020202', fontSize: '36rpx', fontWeight: '400' }" :isBack="true">
			<view slot="content" class="u-flex nav-wrap" style="margin: auto" v-if="type==0">
				支付成功
			</view>
			<view slot="content" class="u-flex nav-wrap" style="margin: auto" v-if="type==1">
				报名成功
			</view>
		</shopro-navbar>
		<view class="vip">
			<image class="vip-type" src="@/static/success.png" mode=""></image>
			<view class="" style="font-size: 40rpx;color: #ED861F;" v-if="type==0">
				您已成为项目会员！
			</view>
			<view class="" style="font-size: 40rpx;color: #ED861F;" v-if="type==1">
				报名成功！
			</view>
			<view class="" style="margin-top: 100rpx;" v-if="type==1">
				<view style="font-size: 32rpx;text-align: left;padding-left: 30rpx;">联系客服</view>
				<view class="kefu-box" v-for="(item,i) in kefu" :key="i">
					<view class="kefu-box-left">
						<image class="kefu-box-avatar" :src="item.image" mode=""></image>
						<view class="kefu-box-info">
							<p style="font-size: 28rpx;">{{item.name}}</p>
							<p style="font-size: 24rpx;margin-top: 14rpx;">{{item.mobile}}</p>
						</view>
					</view>
					<image class="kefu-box-qrimage" :src="item.qrimage" mode=""></image>
				</view>
			</view>
		</view>
	</view>
</template>
<script>

	import { mapMutations, mapActions, mapState, mapGetters } from 'vuex';
	export default {
		data() {
			return {
				constants: {},
				type: 0,
				kefu: [],
				kefuType:''
			};
		},
		onLoad(options) {
			this.type = options.type
			this.kefuType = options.kefu
		},
		onShow() {
			this.init()
		},
		methods: {
			...mapActions(['getUserInfo', 'showAuthModal', 'getUserData']),
			init() {
				this.getUserInfo()
				.then(res => {
					console.log(res,'user')
				})
				.catch(e => {
				});
				this.getKefu();
			},
			getKefu() {
				this.$new_http("project.kefu", {}).then((res) => {
					console.log(res, 'res')
					if (res.code == 1) {
						this.kefu = this.kefuType!=1?res.data:uni.getStorageSync('kefu')
					}
				});
			},
			goBack() {
				uni.navigateBack()
			}
		},
	};
</script>
<style scoped>
	.vip {
		text-align: center;
	}

	.vip-type {
		width: 166rpx;
		height: 154rpx;
		margin: 150rpx auto 40rpx auto;
	}

	.kefu-box {
		display: flex;
		align-items: center;
		justify-content: space-between;
		box-shadow: 0rpx 0rpx 8rpx 0rpx rgba(0, 0, 0, 0.12);
		margin: 15rpx 30rpx;
		border-radius: 20rpx;
		background: #fff;
		padding: 20rpx;
	}

	.kefu-box-left {
		display: flex;
		align-items: center;
		text-align: left;
	}

	.kefu-box-avatar {
		width: 110rpx;
		height: 110rpx;
		border-radius: 50%;
		margin-right: 15rpx;
	}

	.kefu-box-qrimage {
		width: 120rpx;
		height: 120rpx;
	}
</style>